import React from 'react'
import {Table} from 'antd'
import classnames from "classnames"
import styles from './List.less'
import AnimTableBody from 'components/DataTable/AnimTableBody'

const MemberList = ({
                      ...memberListProps
                    }) => {

  const columns = [
    {
      title: '序号',
      dataIndex: 'index',
      key: 'index',
      width: 80,
      render: (t, r, i) => (i + 1),
    }, {
      title: '员工姓名',
      dataIndex: 'realname',
      key: 'realname',
      width: 100,
    }, {
      title: ' 登陆用户名',
      dataIndex: 'username',
      key: 'username',
      width: 120,
    }, {
      title: '所在部门',
      dataIndex: 'dept',
      key: 'dept',
      width: 100,
      render: dept => dept ? dept.name : '-',
    }, {
      title: '登录次数',
      dataIndex: 'loginCount',
      key: 'loginCount',
      width: 90,
    }, {
      title: '最后登录时间',
      dataIndex: 'lastLoginAt',
      key: 'lastLoginAt',
      width: 170,
    },
  ]

  const AnimateBody = (props) => {
    return <AnimTableBody {...props} />
  }

  return (
    <Table
      {...memberListProps}
      className={classnames(styles.table)}
      scroll={{x: 800}}
      columns={columns}
      simple
      rowKey={record => record.id}
      components={{
        body: {wrapper: AnimateBody},
      }}
    />
  )
}

export default MemberList
